<!DOCTYPE html>
<html>
<head>
  <title>Word Brainstorm</title>
  <link rel="stylesheet" href="CSSstyle.css">
  <script src="function_words.js"></script>
</head>

<body>
  <h1> Word Brainstorm </h1>
  <h3>Please use the letters below to form as many words as you can.</h3>
  <h3>Please attention that each letter can only be used ONCE.</h3>
  <h3>Please notice that all the possible words contains AT LEAST 3 letters.</h3>
  <h3>And please enter the words in complete lowercase, one word each time.</h3>
  <div class="relative">
    <img src="letters chart.png" width="300" height="300"></img>
    <button id="bt1" onclick="enterWord()">Enter a word you form</button>
    <button id="bt2" onclick="myResult()">Click for your result</button>
    <button id="bt3" onclick="checkAnswers()" >Click for complete answers</button>
    <button id="bt4" onclick="hideAnswers()" >Click to hide all answers</button>
  </div>
  <h2 id="yourWords"> You have brainstormed the following words: </h2>
  <h2 id="theAnswer"> All 13 possible words are: </h2>
</body>
</html>
